import { Card, List, Comment, Avatar } from "antd";
import { UserOutlined } from "@ant-design/icons";
import FromNow from "../../component/fromnow";

export default function Replies(props) {
    let { data, loading } = props;
    return (
        <Card title="评论列表" loading={loading}>
            <List
                dataSource={data}
                renderItem={(itemData, index) => {
                    let { author, content, create_at } = itemData;
                    return (
                        <List.Item>
                            <Comment
                                author={author.loginname}
                                avatar={
                                    <Avatar
                                        icon={<UserOutlined />}
                                        src={author.avatar_url}
                                        title={author.loginname}
                                    />
                                }
                                content={
                                    <div
                                        dangerouslySetInnerHTML={{
                                            __html: content,
                                        }}
                                    ></div>
                                }
                                key={index}
                                datetime={
                                    <>
                                        发表于：
                                        <FromNow date={create_at} />
                                    </>
                                }
                            />
                        </List.Item>
                    );
                }}
                pagination={true}
            ></List>
        </Card>
    );
}
